<template>
    <div class="foot">
            <ul>
                <h3><em>Contact information</em></h3>
                <li>Telephone&Fax: +86 xxxxxxxxxx ; +86 xxxxxxx</li>
                <li>Email： gnaghongyu@outlook.com</li>
                <li>黑龙江省哈尔滨信息工程学院</li>
                <li style="font-size: 12px;">Harbin Institute of information engineering, Heilongjiang Province</li>
                <li><img src="@/assets/img/common/szicbok.gif" alt=""></li>
            </ul>
        <div class="address">
            <h3><em>Where are we?</em></h3>
            <foot-address class="map"></foot-address>
        </div>

    </div>
</template>

<script>
    import FootAddress from "./Compons/FootAddress";
    export default {
        name: "Foot",
        components: {
            FootAddress
        }
    }
</script>

<style scoped>
    .foot {
        width: 1000px;
        height: 300px;
        margin: 0 auto;
        padding: 2em;
        display: flex;
        justify-content: space-between;
    }
    .foot h3 {
        color: #ffffff;
        text-align: center;
        line-height: 0.6em;
    }
    .address {
        border-left: 1px solid #626262;
        padding-left: 40px;
    }
    ul {
        list-style: none;
        line-height: 2.5em;
        color: #ffffff;
        text-align: center;
    }
</style>